<template>
  <div>
    <el-form v-if="JSON.stringify(dataForm) !== '{}'" :model="dataForm" ref="dataForm" label-width="120px" size="small">
      <el-form-item label="产品状态：" prop="productName">
        <span v-text="dataForm.newProductStatus"></span>
      </el-form-item>
      <el-form-item label="产品名称:" prop="productName">
        <span v-text="dataForm.productName"></span>
      </el-form-item>
      <el-form-item label="所属机构:" prop="corporationId">
        <span v-text="dataForm.corporationName"></span>

      </el-form-item>
      <el-form-item label="可申请区域:" prop="admitArea">
        <span v-text="dataForm.admitArea.replaceAll(',','、')"></span>
      </el-form-item>
      <el-form-item label="产品权益:" prop="productContent">
        <span v-text="dataForm.productContent"></span>
      </el-form-item>
      <el-form-item label="办理条件：" prop="applyQualification">
        <span v-text="dataForm.applyQualification"></span>
      </el-form-item>
      <el-form-item label="项目点：" prop="locationVos">
        <ProjectArea :show-edit="false" :key="dataForm.projectLocationResults.length" :value="dataForm.projectLocationResults"/>
      </el-form-item>
      <el-form-item label="产品推荐语：" prop="productSlogan">
        <span v-text="dataForm.productSlogan"></span>

      </el-form-item>
      <el-form-item label="卡片宣传图：" prop="imgUrl">
        <ul class="el-upload-list el-upload-list--picture-card">
          <li class="el-upload-list__item is-ready">
            <img :src="dataForm.imgUrl" alt="" class="el-upload-list__item-thumbnail"/>
          </li>
        </ul>
      </el-form-item>
      <el-form-item label="其他备注：" prop="supplement">
        <span v-text="dataForm.supplement"></span>

      </el-form-item>
    </el-form>

  </div>

</template>

<script>
import {common} from '@/utils/common'
import uploadSingleImg from '@/components/uploadSingleImg'
import multiCascader from '@/components/multiCascader'
import {mapState} from 'vuex'
import api from '../api'
import {getCookie} from '@/utils/util'
import {CONSTANT_OBJ} from '@/utils/constant'
import ProjectArea from './ProjectArea.vue'

export default {
  props: {
    editData: Object,
    org: {
      type: Object,
      default () {
        return {}
      }
    }
  },
  components: {uploadSingleImg, multiCascader, ProjectArea},
  data () {
    return {
      selectedOptions: [],
      locationDialog: false,
      tenantId: getCookie('tenantId'),
      dataForm: {
        roleName: '',
        productId: '',

        productName: '',//产品名称
        corporationId: '',//机构ID
        admitArea: '',//可申请区域
        productContent: '',//产品内容
        applyQualification: '',//申请资格
        projectLocation: '',//项目点
        productSlogan: '',//产品推荐语
        imgBsnNo: '',//影像批次号
        imgUrl: '',//影像路径
        supplement: '',//补充说明
        projectLocationResults:[]
      },

      corporationList: [],

    }
  },
  methods: {
    // 预览图片

    close () {
      this.$emit('close')
    },

    onChangeImg (file) {
      this.dataForm.imgUrl = file.url
    },
    //获取机构列表数据
    getOrgList () {
      api.queryList({tenantId: getCookie('tenantId')}).then(res => {
        const {responseCode, responseMsg, data} = res
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          this.corporationList = data
          let find = this.corporationList.find(item => item.corporationId === this.editData.corporationId)||{}
          this.dataForm.corporationName = find.corporationName
          console.log('机构列表', this.corporationList)
        }
      })
    },
    getDetail () {
      api.queryDetail({productId: this.editData.productId, productType: 'CREDIT'}).then(res => {
        const {responseCode, responseMsg, data} = res
        if (responseCode === CONSTANT_OBJ.RES_SUCCESS) {
          data.newProductStatus = data.productStatus === 'OPEN' ? '已上架' : '已下架';
          this.dataForm = data
          this.getOrgList()
        }
      })
    },

  },
  mounted () {
    this.getDetail()
  },
  computed: {
    ...mapState({
      dicts: state => state.common.dicts
    })
  }
}
</script>

<style scoped>
</style>

